import { ConfigEnv, defineConfig, loadEnv, UserConfig } from 'vite'
import path from 'path'
import vue from '@vitejs/plugin-vue'
import vueDevTools from 'vite-plugin-vue-devtools'
import tailwindcss from '@tailwindcss/vite'
import AutoImport from 'unplugin-auto-import/vite'
import Components from 'unplugin-vue-components/vite'
import { fileURLToPath } from 'node:url'
// 根据项目ui矿建配置 unplugin-vue-components 自动导入注册组件

// https://vite.dev/config/
export default defineConfig(({ mode }: ConfigEnv): UserConfig => {
  const root = process.cwd()
  const env = loadEnv(mode, root)
  return {
    root,
    base: './',
    publicDir: fileURLToPath(new URL('./public', import.meta.url)), // 无需处理的静态资源位置
    assetsInclude: fileURLToPath(new URL('./src/assets', import.meta.url)), // 需要处理的静态资源位置
    css: {
      preprocessorOptions: {
        scss: {
          // additionalData: `@import "./src/styles/index.scss";`  // 引入全局css变量
        }
      }
    },
    plugins: [
      vue(),
      vueDevTools(),
      tailwindcss(),
      // 自动导入
      AutoImport({
        imports: ['vue', 'vue-router', 'pinia'],
        // 处理eslint
        eslintrc: {
          enabled: true // 默认false
        },
        resolvers: [],
        dts: fileURLToPath(new URL('./types/auto-import.d.ts', import.meta.url))
      }),
      // 自动注册组件
      Components({
        resolvers: [],
        dts: fileURLToPath(new URL('./types/components.d.ts', import.meta.url)),
        dirs: [fileURLToPath(new URL('./src/components', import.meta.url))]
      })
    ],
    // 配置别名
    resolve: {
      alias: {
        '@': path.resolve(__dirname, './src'),
        '#': path.resolve(__dirname, './types')
      }
    },
    server: {
      host: true,
      port: 9001,
      open: false,
      cors: true,
      proxy: {
        [env.VITE_BASE_API]: {
          target: 'http://localhost:9001',
          // 改变 Host Header
          changeOrigin: true
          // 发起请求时将 '/api' 替换为 ''
          //rewrite: (path) => path.replace(/^\/api/, ""),
        }
      }
    },
    build: {
      // 关闭 sourcemap 报错不会映射到源码
      sourcemap: false,
      // 打包大小超出 400kb 提示警告
      chunkSizeWarningLimit: 400,
      rollupOptions: {
        // 打包入口文件 根目录下的 index.html
        // 也就是项目从哪个文件开始打包
        input: {
          index: fileURLToPath(new URL('./index.html', import.meta.url))
        },
        treeshake: {
          preset: 'recommended'
        },
        // 静态资源分类打包
        output: {
          experimentalMinChunkSize: 20 * 1024,
          manualChunks: (id: string) => {
            // if (id.includes('html-canvas')) {
            //   return 'html-canvas'
            // } 一个文件打包到一个chunk中 如使用率较低
            if (id.includes('node_modules')) {
              return 'vendor'
            }
            // return 'index';
          },
          chunkFileNames: 'static/js/[name]-[hash].js', // 代码分割后文件名
          entryFileNames: 'static/js/[name]-[hash:6].js', // 入口文件名
          assetFileNames: 'static/[ext]/[name]-[hash].[ext]' // 静态资源文件名
        }
      }
    }
  }
})
